<template>
	<view style="padding:0 20upx;">
		<view class="top-time">
			<countDown ref="down" :widths='340' :breadth='40' :times='downTime' @endTime='endTime'>
				<view class="tip">
					{{slotText}}
				</view>
			</countDown>
		</view>
		<view class="mybox">
			<view class="title">
				当前使用套餐
			</view>
			<view class="item">
				<view class="name">
					订单号
				</view>
				<view class="value">
					{{orderDetail.order_info.order_no||''}}
				</view>
			</view>
			<view class="item">
				<view class="name">
					商品名称
				</view>
				<view class="value">
					{{orderDetail.service_info.goods_info.title||''}}
				</view>
			</view>
			<view class="item">
				<view class="name">
					套餐分类
				</view>
				<view class="value">
					{{orderDetail.service_info.device_type_name||''}}
				</view>
			</view>
			<view class="item">
				<view class="name">
					使用店面
				</view>
				<view class="value">
					{{orderDetail.service_info.shop_name||''}}
				</view>
			</view>
			<view class="item">
				<view class="name">
					套餐单次总时长(分钟)
				</view>
				<view class="value">
					{{orderDetail.service_info.service_time||''}}
				</view>
			</view>
			<view class="item">
				<view class="name">
					剩余核销时长(分钟)
				</view>
				<view class="value">
					{{orderDetail.service_info.use_time||''}}
				</view>
			</view>
		</view>
		<view class="bot">
			<view class="btnw" @tap="toList">
				补时长列表
			</view>
			<view class="btnr" @tap="stop">
				{{isStop?'扫一扫':'手动终止'}}
			</view>
		</view>
		<scancodeCom ref="sancode" @getStart="initData" />
	</view>
</template>

<script>
	import Bluetooth from "@/utils/Bluetooth";
	import bluetoothMixins from "@/mixins/Bluetooth.js";
	import store from '@/store'
	import {
		serviceStart,
		serviceInfo,
		serviceStop
	} from '@/api/device.js'
	import countDown from './countDown.vue'
	import scancodeCom from '../scancodeCom/scancodeCom.vue'
	export default {
		data() {
			return {
				deviceData: {},
				order_id: '',
				downTime: 0,
				slotText: '设备进行中',
				btnText: '手动终止',
				isTwo: false,
				isStop: false,
				isReady: false,
				orderDetail: {},
				initOrderData:{}
			}
		},
		components: {
			countDown,
			scancodeCom
		},
		mixins: [bluetoothMixins],
		onShow() {
			if (this.isReady) {
				store.commit("set_bluetooth", Bluetooth);
				this.refreshOrder()
			}
		},
		onLoad(e) {
			if (e.deviceData && e.order_id) {
				store.commit("set_bluetooth", Bluetooth);
				this.initData(e)
			} else {
				uni.navigateBack()
			}
		},
		onReady() {
			this.isReady = true
		},
		methods: {
			initData(e) {
				this.order_id = e.order_id
				this.deviceData = JSON.parse(e.deviceData)
				this.initOrderData = JSON.parse(e.orderData)
				if(this.initOrderData.use_num===2){
					this.isTwo=true
				}
				this.init()
			},
			init() {
				let that = this
				let time = 1
				if (this.initOrderData.use_time === 0) {
					time = this.initOrderData.service_time
				}
				if (this.initOrderData.use_time > 0) {
					time = this.initOrderData.use_time
				}
				this.connectionAndOpen({
					params: {
						time,
						deviceId: this.deviceData.device_id,
						serviceId: this.deviceData.ssid
					},
					success: (res) => {
						uni.showToast({
							title: "开锁成功",
							icon: "success",
							duration: 2000,
						});
						this.closeBluetooth()
						that.serviceStart()
					},
					fail: () => {
						this.closeBluetooth()
						setTimeout(() => {
							uni.navigateBack()
						}, 1500)
					},
				});
			},
			stop() {
				let that = this
				if (this.isStop) {
					this.$refs.sancode.sancode()
				} else {
					this.refreshOrder(1)
				}
			},
			serviceStop() {
				serviceStop({
					service_id: this.orderDetail.id
				}).then(res => {
					if (res.data.code === 1) {
						this.$refs.down.pause()
						if (this.isTwo) {
							uni.showToast({
								title: '当前服务已结束',
								icon: 'none'
							})
							setTimeout(() => {
								uni.navigateBack()
							}, 1500)
						} else {
							this.isStop = true
							this.slotText= '暂停中',
							console.log(88,this.isStop);
						}
					}
				})
			},
			serviceStart() {
				serviceStart({
					device_id: this.deviceData.device_id,
					order_id: this.order_id
				}).then(res => {
					if (res.data.code === 1) {
						this.orderDetail = res.data.data
						let time = 0
						if (this.orderDetail.service_info.use_time === 0) {
							this.downTime = this.orderDetail.service_info.service_time * 60
						}
						if (this.orderDetail.service_info.use_time > 0) {
							this.downTime = this.orderDetail.service_info.use_time * 60
						}
						this.isStop = false
						this.$refs.down.start()
					}
				})
			},
			close(type = 0) {
				let that = this
				this.connectionAndClose({
					params: {
						deviceId: this.deviceData.device_id,
						serviceId: this.deviceData.ssid
					},
					success: (res) => {
						uni.showToast({
							title: "关闭成功",
							icon: "success",
							duration: 2000,
						});
						this.closeBluetooth()
						if (type == 0) {
							setTimeout(() => {
								uni.navigateBack()
							}, 1500)
						}
						if (type == 1) {
							that.serviceStop()
						}

					},
					fail: () => {
						this.closeBluetooth()
					},
				});
			},
			endTime() {
				this.slotText = '使用结束'
			},
			refreshOrder(type = 0) {
				let that = this
				serviceInfo({
					device_id: this.deviceData.device_id,
					service_id: this.orderDetail.id
				}).then(res => {
					if (res.data.code === 1) {
						this.orderDetail = res.data.data
						if (res.data.data.use_num === 2) {
							this.isTwo = true
							this.slotText= '暂停中'
						}
						if (res.data.data.is_runing === 0) {
							if(this.orderDetail.service_info.use_time === 0){
								uni.showToast({
									title: '当前服务已结束',
									icon: 'none'
								})
								setTimeout(() => {
									uni.navigateBack()
								}, 1500)
							}
							if(this.orderDetail.service_info.use_time > 0){
								this.isStop=true
							}
							
						}
						if (res.data.data.is_runing === 1) {
							if (type === 1) {
								if (this.isTwo) {
									uni.showModal({
										content: '您是否确认二次停止，若发生停止，您单卡剩余有效使用时长将归0',
										cancelText: '继续使用',
										confirmText: '确认终止',
										confirmColor: 'F82D1E',
										success: function(res) {
											if (res.confirm) {
												that.close(1)
											}
										}
									});
								} else {
									uni.showModal({
										content: '您是否确认手动停止',
										cancelText: '继续使用',
										confirmText: '确认终止',
										confirmColor: 'F82D1E',
										success: function(res) {
											if (res.confirm) {
												that.close(1)
											}
										}
									});
								}
							}
						}
					}
				})
			},
			toList(){
				uni.navigateTo({
					url:'/pages/shop/addTimeList/addTimeList?order_id='+this.order_id
				})
			}
		}
	}
</script>

<style lang="scss">
	.tip {
		font-size: 24upx;
		width: 140upx;
		padding: 2upx;
		color: #F82D1E;
		text-align: center;
		box-shadow: 0 0 0 0.5px #F82D1E;
	}

	.top-time {
		padding: 40upx 0;
	}

	.mybox {
		border-radius: 20upx;
		box-shadow: 0 0 10upx 1upx #f2f2f2;
		padding: 26upx;

		.title {
			font-size: 32upx;
			padding-bottom: 26upx;
			border-bottom: 1upx solid #f2f2f2;
		}

		.item {
			font-size: 26upx;
			display: flex;
			margin-top: 18upx;

			.name {
				flex: 1;
			}

			.value {
				flex: 1;
				text-align: right;
			}
		}
	}

	.bot {
		display: flex;
		justify-content: space-between;
		padding: 30upx 0;

		.btnw {
			width: 46%;
			text-align: center;
			font-size: 32upx;
			border-radius: 40upx;
			padding: 22upx 0;
			box-shadow: 0 0 10upx 1upx #f2f2f2;
		}

		.btnr {
			width: 46%;
			text-align: center;
			font-size: 32upx;
			border-radius: 40upx;
			padding: 22upx 0;
			color: #F82D1E;
			box-shadow: 0 0 0 1upx #F82D1E;
		}
	}
</style>
